<div class="layui-layout layui-layout-admin">
	<div class="layui-header">
		<!-- 头部区域 -->
		<ul class="layui-nav layui-layout-left">
			<li class="layui-nav-item" lay-unselect>
				<a href="javascript:;" layadmin-event="refresh" title="刷新">
					<i class="layui-icon layui-icon-refresh-3"></i>
				</a>
			</li>
		</ul>
		<ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">
			<li class="layui-nav-item layui-hide-xs" lay-unselect>
				<a href="javascript:;" layadmin-event="clear_cache">
					<i class="layui-icon layui-icon-delete"></i>
				</a>
			</li>
			<li class="layui-nav-item" lay-unselect>
				<a href="javascript:;">
					<cite>admin</cite>
				</a>
				<dl class="layui-nav-child">
					<dd><a lay-href="set/user/info">基本资料</a></dd>
					<dd><a lay-href="set/user/password">修改密码</a></dd>
					<hr>
					<dd layadmin-event="logout" style="text-align: center;"><a>退出</a></dd>
				</dl>
			</li>

			<li class="layui-nav-item layui-hide-xs" lay-unselect>
				<a href="javascript:;" layadmin-event="about"><i class="layui-icon layui-icon-more-vertical"></i></a>
			</li>
			<li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-unselect>
				<a href="javascript:;" layadmin-event="more"><i class="layui-icon layui-icon-more-vertical"></i></a>
			</li>
		</ul>
	</div>

	<!-- 侧边菜单 -->
	<div class="layui-side layui-side-menu">
		<div class="layui-side-scroll">
			<div class="layui-logo" lay-href="">
				<span>yy蛋糕</span>
			</div>

			<ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu"
				lay-filter="layadmin-system-side-menu">
			</ul>
			</script>
		</div>
	</div>

	<div id="c_nav">

	</div>


	<!-- 页面标签 -->
	<script type="text/html" template lay-done="layui.element.render('nav', 'layadmin-pagetabs-nav')">
	{{# if(layui.setter.pageTabs){ }}
		<div class="layadmin-pagetabs" id="LAY_app_tabs">
			<div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
			<div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
			<div class="layui-icon layadmin-tabs-control layui-icon-down">
				<ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
					<li class="layui-nav-item" lay-unselect>
						<a href="javascript:;"></a>
						<dl class="layui-nav-child layui-anim-fadein">
							<dd layadmin-event="closeThisTabs"><a href="javascript:;">关闭当前标签页</a></dd>
							<dd layadmin-event="closeOtherTabs"><a href="javascript:;">关闭其它标签页</a></dd>
							<dd layadmin-event="closeAllTabs"><a href="javascript:;">关闭全部标签页</a></dd>
						</dl>
					</li>
				</ul>
			</div>
			<div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
				<ul class="layui-tab-title" id="LAY_app_tabsheader">
					<li lay-id="/"><i class="layui-icon layui-icon-home"></i></li>
				</ul>
			</div>
		</div>
		{{# } }}
	</script>


	<!-- 主体内容 -->
	<div class="layui-body" id="LAY_app_body">
		<div class="layadmin-tabsbody-item layui-show"></div>
	</div>

	<!-- 辅助元素，一般用于移动设备下遮罩 -->
	<div class="layadmin-body-shade" layadmin-event="shade"></div>

</div>

<script>
	layui.use(['jquery', 'admin', 'table', 'form'], function() {
		var $ = layui.jquery,
			admin = layui.admin,
			setter = layui.setter,
			form = layui.form,
			table = layui.table;

		$(document).on('click', ".layui-nav-tree>.layui-nav-item", function() {
			let _data_name = $(this).data('name');
			$("#c_nav").find('ul').hide();
			let _c_nav_item = $("#c_nav").find('ul[data-name="' + _data_name + '"]');
			if (_c_nav_item.length) {
				_c_nav_item.show();
				$("#c_nav").show();
			} else {
				$("#c_nav").hide();
			}

			if ($("#c_nav:visible").length > 0) {
				$(".layadmin-tabsbody-item.layui-show").css('left', '140px');
			} else {
				$(".layadmin-tabsbody-item.layui-show").css('left', '0');
			}
		});

		$(document).on('click', ".c_nav_a_item", function() {
			let _this = $(this);
			_this.next().toggle();
			let _icon_item = _this.find('.layui-icon.second-icon');
			if (_icon_item.hasClass('up')) {
				_icon_item.removeClass('up');
				_this.addClass('active')
			} else {
				_icon_item.addClass('up');
				_this.removeClass('active')
			}
		});

		// 获取菜单数据
		admin.req({
			url: setter.API_HOST + 'admin/main/menu',
			done: function(res) {
				if (res.code == 0) {
					console.log(res)
					let _nav_html = [];
					let _c_nav_html = [];
					_nav_html.push('<li data-name="main" data-jump="/" class="layui-nav-item">');

					_nav_html.push(
						'<a href="javascript:;" lay-tips="main" lay-href="/" lay-direction="2">');
					_nav_html.push('<i class="fa fa-home"></i>');
					_nav_html.push('<cite>主页</cite>');
					_nav_html.push('</a>');
					_nav_html.push('</li>');
					$.each(res.data.menuInfo, function(i, d) {
						_nav_html.push('<li data-name="' + d.name + '" data-jump="' + d.file_path +
							'" class="layui-nav-item">');

						_nav_html.push('<a href="javascript:;" lay-tips="' + d.name +
							'" lay-direction="2">');
						_nav_html.push('<i class="' + d.icon + '"></i>');
						_nav_html.push('<cite>' + d.title + '</cite>');
						_nav_html.push('</a>');
						_nav_html.push('</li>');

						if (d.child) {
							_c_nav_html.push('<ul data-name="' + d.name + '">');
							$.each(d.child, function(ci, cd) {
								_c_nav_html.push('	<li class="c_nav_item">');
								if (cd.child) {
									_c_nav_html.push(
										'		<a href="javascript:;" class="c_nav_a_item">'
									);
									_c_nav_html.push('			<cite>' + cd.title +
										'</cite>');
									_c_nav_html.push(
										'			<i class="layui-icon second-icon layui-icon-triangle-d up"></i>'
									);
								} else {
									_c_nav_html.push(
										'		<a href="javascript:;" lay-href="' + cd
										.file_path + '" class="c_nav_a_item">' + cd
										.title);
								}
								_c_nav_html.push('		</a>');
								if (cd.child) {
									_c_nav_html.push('<dl>');
									$.each(cd.child, function(k, v) {
										_c_nav_html.push(
											'<dd><a href="javascript:;" lay-href="' +
											v.file_path + '">' + v.title +
											'</a></dd>');
									});
									_c_nav_html.push('</dl>');
								}
								_c_nav_html.push('	</li>');
							});
							_c_nav_html.push('	</ul>');
						}
					});
					$(".layui-nav-tree").html(_nav_html.join(''));
					$("#c_nav").html(_c_nav_html.join(''));

					admin.menuActive('/' + layui.router().path.join('/'));
				}
			}
		});

		// 打开数据编辑面板
		$(document).on('click', '.save', function() {
			let _this = $(this);
			admin.popupRight({
				id: 'LAY_adminPopupAbout',
				area: "800px",
				success: function() {
					layui.view(this.id).render(_this.data('url'), {
						id: _this.data('id')
					});
				}
			});
		});

		//监听提交
		form.on('submit(LAY-send-submit)', function(data) {
			admin.req({
				type: 'post',
				url: data.form.action,
				data: data.field,
				done: function(res) {
					console.log(res)
					if (res.code == 0) {
						layer.msg('保存成功', {
							time: 888,
							icon: 1
						}, function() {
							table.reload(data.field.list_table_name);
							$(".layui-layer-shade").click();
						});
					} else {
						layer.msg('保存失败', {
							icon: 5
						});
					}
				}
			});

			return false;
		});

		// 删除数据
		$(document).on('click', '.delete', function(res) {
			let _this = $(this);
			layer.confirm('确认删除？', function(_index) {
				admin.req({
					url: setter.API_HOST + _this.data('url'),
					done: function(res) {
						layer.close(_index);
						if (res.code == 0) {
							layer.msg('删除成功', {
								time: 888,
								icon: 1
							}, function() {
								table.reload(_this.parents('.layui-form').attr('lay-id'));
							});
						} else {
							layer.msg('删除失败', {
								icon: 5
							});
						}
					}
				});
			});
			return false;
		});
	});
</script>
